<!DOCTYPE html>
<html>
<title>Test that player state is reflected in CSS classes on the fullscreen button.</title>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script src="../media-controls.js"></script>
<video controls width=400></video>
<script>
async_test(t => {
  var video = document.querySelector('video');

  video.onwebkitfullscreenchange = t.step_func_done(_ => {
    checkButtonHasClass(fullscreenButton(video), 'fullscreen');
  });

  document.onclick = t.step_func(_ => {
    fullscreenButton(video).click();
  });

  video.onplaying = t.step_func(_ => {
    checkButtonNotHasClass(fullscreenButton(video), 'fullscreen');
    clickAtCoordinates(1, 1);
  });

  video.src = "../content/counting.ogv";
  video.play();
});
</script>
</html>
